<template>
  <div class="bold-size">
    <Head
      :title="title"
      style="border-bottom: 2px solid #dad9df"
      id="backstyle"
    ></Head>
    <div class="war" v-if="list.length">
      <div class="area-center">
        <div class="small bold-size">
          {{ this.$route.query.title }}
        </div>

        <div class="xi bold-size" v-for="(item, index) in list" :key="index">
          <div class="yuan">{{ index + 1 }}.</div>
          <div class="zhong">
            {{ item.commerceName }}
          </div>
        </div>
      </div>
    </div>

    <div v-else class="tac c999 m-t-20">暂无数据</div>
  </div>
</template>

<script>
import Head from "@/components/public/HeadPage.vue";
import { selectTCommerceProvince, CommerceType } from "@/api/index";
export default {
  data() {
    return {
      list: "",
      title: "", //标头标题
    };
  },
  methods: {},
  components: {
    Head,
  },
  mounted() {
    if (
      this.$route.query.title == "福建省各商企通讯名单" ||
      // this.$route.query.title == "全国各省商企通讯名单" ||
      this.$route.query.title == "海外商企通讯名单"
    ) {
      selectTCommerceProvince({
        commercetypeId: this.$route.query.id,
        commerceProvince: this.$route.query.citysub,
      }).then((res) => {
        if (res.data.code == 200) {
          if (res.data.data == "") {
          } else {
            this.list = res.data.data;
            this.title = res.data.data[0].commercetypeId;
          }
        }
      });
    } else if (this.$route.query.title == "全国各省商企通讯名单") {
      //全国连锁行业
      CommerceType({
        commercetypeId: this.$route.query.id,
      }).then((res) => {
        if (res.data.code == 200) {
          if (res.data.data == "") {
          } else {
            this.list = res.data.data;
            this.title = res.data.data[0].commercetypeId;
          }
        }
      });
    } else {
      selectTCommerceProvince({
        commercetypeId: this.$route.query.id,
        commerceProvince: this.$route.query.citysub,
      }).then((res) => {
        if (res.data.code == 200) {
          if (res.data.data == "") {
          } else {
            this.list = res.data.data;
            this.title = res.data.data[0].commercetypeId;
          }
        }
      });
    }
  },
};
</script>

<style scoped>
.bottom {
  width: 100%;
  height: 6rem;
  display: flex;
  justify-content: center;
  /* background-color: #f0eff5; */
}

/* 版心区域 */
.center {
  height: 0.3rem;
  margin-top: 0.05rem;
}
/* 盒子区域 */
.small {
  width: 100%;
  height: 0.3rem;
  line-height: 0.3rem;
  text-indent: 0.1rem;
}
.context {
  width: 100%;
  height: 100%;
  margin-top: 0.05rem;
}

.xi {
  width: 100%;
  margin-top: 0.05rem;
  display: flex;
}
.xi .yuan {
  width: 0.16rem;
  height: 0.16rem;
  margin-left: 0.1rem;
  text-align: center;
  line-height: 0.16rem;
  margin-top: 0.07rem;
}

/* 中间区域 */
.zhong {
  width: 95%;
  height: 100%;
  line-height: 0.29rem;
  padding-left: 0.05rem;
}
</style>